<template>
    <div class="page-container">
        <el-tabs v-model="viewName" type="border-card">
            <el-tab-pane label="审核列表" name="exam">
                <!--工具栏-->
                <div class="toolbar" style="float:left;padding-top:10px;padding-left:15px;">
                    <el-form :inline="true" :model="filters" :size="size">
                        <el-form-item>
                            <el-input v-model="filters.name" placeholder="标题" clearable></el-input>
                        </el-form-item>
                        <el-form-item>
                            <el-select v-model="exam.type" clearable placeholder="请选择类型">
                                <el-option v-for="item in exam.types"
                                           :key="item.value" :label="item.text" :value="item.value"
                                ></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item>
                            <el-select v-model="exam.status" clearable placeholder="请选择状态">
                                <el-option v-for="item in exam.statuses"
                                           :key="item.value" :label="item.text" :value="item.value"
                                ></el-option>
                            </el-select>
                        </el-form-item>
                        <el-form-item>
                            <kt-button icon="fa fa-search" :label="$t('action.search')" perms="sys:role:view"
                                       type="primary"
                                       @click="findPage(null)"/>
                        </el-form-item>
                        <el-form-item>
                            <kt-button icon="fa fa-plus" :label="$t('action.add')" perms="sys:user:add" type="primary"
                                       @click="handleAdd"/>
                        </el-form-item>
                    </el-form>
                </div>
                <div class="toolbar" style="float:right;padding-top:10px;padding-right:15px;">
                    <el-form :inline="true" :size="size">
                        <el-form-item>
                            <el-button-group>
                                <el-tooltip content="刷新" placement="top">
                                    <el-button icon="fa fa-refresh" @click="findPage(null)"></el-button>
                                </el-tooltip>
                                <el-tooltip content="列显示" placement="top">
                                    <el-button icon="fa fa-filter" @click="displayFilterColumnsDialog"></el-button>
                                </el-tooltip>
                            </el-button-group>
                        </el-form-item>
                    </el-form>
                    <!--表格显示列界面-->
                    <table-column-filter-dialog ref="tableColumnFilterDialog" :columns="columns"
                                                @handleFilterColumns="handleFilterColumns">
                    </table-column-filter-dialog>
                </div>
                <el-table :data="pageResult.content" border height="580">
                    <el-table-column v-for="item in columns" :key="item.id" :label="item.label" :width="item.width"
                                     :prop="item.prop"></el-table-column>
                    <el-table-column label="操作">
                        <template slot-scope="scope">
                            <el-button type="success" size="small" @click="examSubject(scope.$index)">审核</el-button>
                        </template>
                    </el-table-column>
                </el-table>
                <div>
                    <el-pagination
                            background
                            layout="total, sizes, prev, pager, next, jumper"
                            :total="pageResult.totalSize"
                            :page-size="15"
                            :page-sizes="[15, 30, 50, 100]"
                            @size-change="resizeRequest"
                            @current-change="refreshPageRequest"
                            style="float:right;"
                    >
                    </el-pagination>
                </div>
                <!--        <kt-table :data="pageResult" :columns="filterColumns" @findPage="findPage" @handleEdit="handleEdit" @handleDelete="handleDelete">-->
                <!--        </kt-table>-->
            </el-tab-pane>
            <el-tab-pane label="审核明细" name="examInfo">
                <el-form ref="examEdit">
                    <el-row>
                        <el-col :span="3">
                            标题
                        </el-col>
                        <el-col :span="20">
                            {{exam.examEdit.title}}
                        </el-col>
                    </el-row>
                    <el-row v-if="exam.examEdit.htmlSubject">
                        <el-col :span="3">
                            题目
                        </el-col>
                        <el-col :span="20" z-index="-1">
                            <mavon-editor
                                    :value="exam.examEdit.htmlSubject"
                                    :subfield="prop.subfield"
                                    :defaultOpen="prop.defaultOpen"
                                    :toolbarsFlag="prop.toolbarsFlag"
                                    :editable="prop.editable"
                                    :scrollStyle="prop.scrollStyle"
                                    style="height: 100%;width: 100%;z-index:1;"
                            ></mavon-editor>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="3">
                            内容
                        </el-col>
                        <el-col :span="20" z-index="-1">
                            <mavon-editor
                                    :value="exam.examEdit.htmlContent"
                                    :subfield="prop.subfield"
                                    :defaultOpen="prop.defaultOpen"
                                    :toolbarsFlag="prop.toolbarsFlag"
                                    :editable="prop.editable"
                                    :scrollStyle="prop.scrollStyle"
                                    style="height: 100%;width: 100%;z-index:1;"
                            ></mavon-editor>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="3">拒绝原因</el-col>
                        <el-col :span="20"><el-input type="text" placeholder="拒绝时必填"
                                                    v-model="mongoInfo.updateParams.reason"></el-input></el-col>
                    </el-row>
                </el-form>
                <el-button type="primary" @click="detail(null)">刷新</el-button>
                <el-button type="success" @click="agreeDone">通过</el-button>
                <el-button type="warning" @click="refuseDone">拒绝</el-button>
            </el-tab-pane>
        </el-tabs>
    </div>
</template>

<script>
  import {data} from '@/contentjs/Exam.js';
  export default data
</script>

<style scoped>
    .page-container {
        height: 770px;
    }
    .el-row{
        margin-top: 2em;
    }
</style>
